<%@ page language="java" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html class="root61">
<head>
<%@include file="/views/common/include/taglib.jsp"%>
<%@include file="/views/common/include/head.jsp"%>
<link type="text/css" rel="stylesheet" href="${ctx}/css/dlifestyle/table.css" />
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=gYsFyB1PCP73ZqAxQeOaGYBrgZuhmXyj"></script>

</head>
<body class="body" style="margin: 0px;">
	<%@include file="/views/common/header.jsp"%>
	<section>
		<section id="left">
			<!-- 二三级菜单区域 -->
		</section>
		<section id="main" class="main">
			<!-- 内容区域 -->
		</section>
	</section>
	<script type="text/javascript">
		/**加载二三级菜单区域*/
		function loadLeft(menuId) {
		    var sel = $("#cells").val();
			$("#left").load(
					getUrl('${ctx}/left?menuId=' + menuId+"&cellId="+sel),
					function(response, status, xhr) {
						if (status != 'success') {
							$("#left").load(getUrl('${ctx}/leftError?menuId=' + menuId));
						} else {
							$.get(getUrl("${ctx}/content?menuId=" + menuId), function(
									result) {
								result = JSON.parse(result);
								if (result.success && result.obj != null) {
									var menu = result.obj;
									if (menu.menuLevel == 2) {
										clickSecondMenu(menu.id,
												menu.locationURL);
									} else {
										clickThirdMenu(menu.parentId, menu.id,
												menu.locationURL);
										clickShowOrHide(menu.parentId);
									}
								} else {
									$("#left").load(getUrl('${ctx}/leftError?menuId=' + menuId));
								}
							});
						}

						//更换一级菜单选中状态
						$("li[name='firstMenu']").each(function() {
							$(this).removeClass("admin_nav_ul_li_active");
						});
						$("#firstMenu" + menuId).addClass(
								"admin_nav_ul_li_active");
					});
		}

		loadLeft('${sessionScope.user_login.menu.id}');

		/**加载内容区域*/
		function loadContent(url) {
			var index = layer.load(1);

			$("#main").load(getUrl('${ctx}' + encodeURI(url)), function(response, status, xhr) {
				if (status != 'success') {
					$("#main").load(getUrl('${ctx}/contentError?url=' + url));
				}else{
					$('html, body').animate({scrollTop:0}, 'slow');//页面滑动到顶部
				}
				
				layer.close(index);
			});
		}

		/**加载内容区域，二级菜单点击*/
		function clickSecondMenu(id, url) {
			var index = layer.load(1);

			$("#main").load(getUrl('${ctx}' + url), function(response, status, xhr) {
				if (status != 'success') {
					$("#main").load(getUrl('${ctx}/contentError?url=' + url));
				}else{
					$('html, body').animate({scrollTop:0}, 'slow');//页面滑动到顶部
				}

				layer.close(index);

				//更换二级菜单选中状态
				$("li[name='secondMenu']").each(function() {
					$(this).removeClass("second-menu-active");
				});
				$("#secondMenu" + id).addClass("second-menu-active");

				//重置三级菜单状态
				$("li[name='thirdMenu']").each(function() {
					$(this).removeClass("three-menu-active");
				});

				$("li[name='thirdMenuSpan']").each(function() {
					$(this).removeClass("three-menu-selected-point-active");
				});

				$("img[name='thirdMenuImg']").each(function() {
					$(this).hide();
				});
				$("ul[name='third']").each(function() {
					$(this).hide();
				});

				$("img[name='thirdimg']").each(function() {
					$(this).attr('src', "${ctx}/images/system/more_close.png");
				});
			});
		}

		/**加载内容区域，三级菜单点击*/
		function clickThirdMenu(parent, id, url) {
			var index = layer.load(1);

			$("#main")
					.load(getUrl('${ctx}' + url),
							function(response, status, xhr) {
								if (status != 'success') {
									$("#main").load(getUrl('${ctx}/contentError?url=' + url));
								}else{
									$('html, body').animate({scrollTop:0}, 'slow');
								}
								
								layer.close(index);

								//更换三级菜单选中状态
								$("li[name='thirdMenu']").each(function() {
									$(this).removeClass("three-menu-active");
								});
								$("#thirdMenu" + id).addClass(
										"three-menu-active");

								$("li[name='thirdMenuSpan']")
										.each(
												function() {
													$(this)
															.removeClass(
																	"three-menu-selected-point-active");
												});
								$("#thirdMenuSpan" + id).addClass(
										"three-menu-selected-point-active");

								$("img[name='thirdMenuImg']").each(function() {
									$(this).hide();
								});
								$("#thirdMenuImg" + id).show();

								//更换二级菜单选中状态
								$("li[name='secondMenu']").each(function() {
									$(this).removeClass("second-menu-active");
								});
								$("#secondMenu" + parent).addClass(
										"second-menu-active");
							});

		}

		/**三级菜单显示或隐藏*/
		function clickShowOrHide(id) {
			if ($("#third" + id).is(":hidden")) {
				$("#third" + id).show();
				$("#thirdimg" + id)
						.attr('src', "${ctx}/images/system/more.png");
			} else {
				$("#third" + id).hide();
				$("#thirdimg" + id).attr('src',
						"${ctx}/images/system/more_close.png");
			}
		}
		
		/**加时间戳参数，防止IE下缓存不刷新*/
		function getUrl(url){
			if(url.indexOf('?') > 0){
				return url + "&timestamp=" + Date.parse(new Date());
			}
			
			return url + "?timestamp=" + Date.parse(new Date());
		}
		
		function cellChange(){
			var sel = $("#cells").val();
			var index = layer.load(1);
			$.get(ctx+"/changeCell" + "?timestamp=" + Date.parse(new Date()),{
				cellId: sel,
			},function(data){
				data = JSON.parse(data);
				if(data.success){
					location.href = ctx + "/main";
				}else{
					layer.close(index);
					layer.msg(data.msg, {icon: 5});
				}
			})
		}
		
		function cellNameChange(){ 
			var element = document.getElementById("cellname"); 
			if("\v"=="v") { 
				element.onpropertychange = webChange; 
			}else{ 
				element.addEventListener("input",webChange,false); 
			} 
			
			function webChange(){ 
				if(element.value != undefined){
					$.get(ctx+"/searchCell" + "?timestamp=" + Date.parse(new Date()),{
						cellName: element.value
					},function(data){
						data = JSON.parse(data);
						if(data.success){
							$("#cells").html("");
							if("${sessionScope.user_login.userType}" == '0'){
								if('${sessionScope.user_login.currentCell}' == 'null'){
									$("#cells").append('<option value="" selected="selected">选择小区</option> ');
								}else{
									$("#cells").append('<option value="" >选择小区</option> ');
								}
								
								var list = data.obj;
								if(list != null && list.length > 0){
									for(var i = 0 ;i < list.length ; i ++){
										if("${sessionScope.user_login.currentCell.id}" == list[i].id){
											$("#cells").append('<option value="' + list[i].id + '" selected="selected">' + list[i].cellName + '</option>');
										}else{
											$("#cells").append('<option value="' + list[i].id + '">' + list[i].cellName + '</option>');
										}
									}
								}
							}
						}else{
							layer.close(index);
							layer.msg(data.msg, {icon: 5});
						}
					})
				}
			}; 
		} 
		
		cellNameChange();
	</script>
</body>
</html>